<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
 <!-- Bootstrap core CSS -->
    <link href="../css/coach/bootstrap.css" rel="stylesheet">
    <!-- Add custom CSS here -->
    <link href="../css/coach/sb-admin.css" rel="stylesheet">
    <!-- Page Specific CSS -->
    <link rel="stylesheet" href="../css/coach/morris-0.4.3.min.css">
	<link rel="stylesheet" href="../layui/css/layui.css">
  <link rel="import" href="../jsp/toolbar.jsp" id="head"> 	
	  <script type="text/javascript" src="../js/jquery-2.2.3.min.js"></script>
	  <script type="text/javascript" src="../layui/layui.js"></script>
	  <script type="text/javascript" src="../js/regular.js"></script>
	  <style>
		  	#all{
		  	width: 1000px;
		  	height: 80%;
		  	position: absolute; left: 50%; top: 50%;
		  	text-align: center;
		  	transform: translate(-50%, -50%);		
		  }
		  body{
		  	background-image: url(../images/top.jpg);
		  	background-position: 100% 100%;
		  	background-attachment: fixed;
		  	background-repeat: no-repeat;
		  	background-size: cover; -moz-background-size: cover; 
		  }  
		  #headFrame{
			  width: 150px;
			  height: 150px;
			  border: 1px solid #000000;
			  position: absolute; left: 50%; top: 5%;
			  background-size: cover;
			  background-repeat: no-repeat;
		  }
		  #head{
		  		width:80px;
		  		height: 50px;
		  		position: absolute; left: 65%; top: 28%;
		  }
		 .message{
			width: 52%;
			height: 45%;
			border: #000000 solid 1px;
			position: absolute;
			top: 20%;
			left: 32%;
			font-size: 15px;
			color: olive;
			text-align: center;			
		} 
		text{
			padding-top:5px;
		}
		input {
		margin-bottom: 5px;
}
	  </style>
	<script>
		layui.use('form', function(){
 		 var form = layui.form;
		});
	</script>
</head>
<body>
<script type="text/javascript">
		document.write(head.import.body.innerHTML);
		</script>
		<div id="all">	
	<div class="message">	
	<form class="layui-form layui-form-pane" id="updateMessage">
  <div class="layui-form-item" style="font-size: 20px; text-align: center" >
    安全设置
  </div>
  <div class="layui-form-item">
    <div class="layui-input-block">
      <input class="layui-btn" value="zz" onclick="send()">
    </div>
  </div>
</form>
 </div>
 </div>
	  <script>
	  //Demo
	  layui.use('form', function(){
	    var form = layui.form;
	    form.render(); 
	  });
	  $(function(){
			showMessage();
		});	
		//教练加载信息
		function showMessage(){
			$.ajax({
				url:"/vi_user_student/selectByUid",
				type:"post",
				success:function(data){
				 	if(data.uphone.indexOf("un")!=-1){
						data.nickName="请绑定手机";
					}
					if(data.umail.indexOf("un")!=-1){
						data.umail="请绑定邮箱";
					}  
					// 通过改变 text的value值来显示的信息
					var content ='<div class="layui-form-item" style="font-size: 20px; text-align: center" >安全信息</div>';
	
					var uphone ='<div class="layui-form-item" >'
					   +' <label class="layui-form-label">邮箱</label>'
					   +'<div class="layui-input-inline">'					   	
						+'<input type="text" name="authentication" placeholder="请输入邮箱"  class="layui-input" id="mail" onkeyup="addMailCheck()"></div>'
						+'<div class="layui-input-inline">'
					 	+'<input type="button" class="layui-btn layui-btn-normal" onclick="changeMail();" value="发送" id="sendMail">'
						+'</div><p><span id="judge2"></span></p></div> '			
					var code ='<div class="layui-form-item" >'
							   +' <label class="layui-form-label">验证码</label>'
							   +'<div class="layui-input-inline">'
								+'<input type="text" name="authentication" placeholder="请输入验证码" class="layui-input" id="nowCode">'
								+'<div class="layui-input-inline">'
								+'</div></div>'		
					var button='<div class="layui-form-item">'
					    +'<div class="layui-input-label">'
				     +'<input type="button" class="layui-btn" value="确定" onclick="sure();">'
				    +'</div></div>'
					content+=uphone+code+button;
					$("#updateMessage").html(content)			
				}	
			});
		}
 function sure(){
	$.ajax({
		url:"/user/updateUserByMail",
		type:"post",
		data:{
			umail:$("#mail").val(),
			code:$("#nowCode").val()
		},
		success:function(data){
			alert(data);
			location.href="coachSafe.html";
		}
	});
} 		
function changeMail(){
	$.ajax({
		url:"/user/sendMail",
		type:"post",
		data:{
			mail:$("#mail").val()
		},
	});
}		
	  </script>	
</body>
</html>